Skip to content

Conversation

@MananTank
Copy link
Member

@MananTank MananTank commented Nov 18, 2025


PR-Codex overview

This PR introduces a new user interface for the FaucetButton component that informs users on the paid-plan-required condition, encouraging them to upgrade their plan if they are on a free plan.

Detailed summary

  • Added a condition to check if canClaimFaucetQuery.data.type is "paid-plan-required".
  • If true, renders a Button linking to the billing page with a message about upgrading the plan.
  • Removed a commented-out line regarding an upsell path for subscription plans.

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

Summary by CodeRabbit

  • New Features
    • Faucet button now provides a direct link to billing/subscription when claiming is blocked by plan limits and shows an inline arrow indicator for a clearer call-to-action.
  • Bug Fixes
    • Retained the disabled button behavior and messages for throttle and unsupported-chain scenarios to prevent regressions.

@changeset-bot
Copy link

changeset-bot bot commented Nov 18, 2025

⚠️ No Changeset found

Latest commit: 7b5682c

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel vercel bot temporarily deployed to Preview – thirdweb_playground November 18, 2025 16:41 Inactive
@vercel vercel bot temporarily deployed to Preview – nebula November 18, 2025 16:41 Inactive
@vercel
Copy link

vercel bot commented Nov 18, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
thirdweb-www Ready Ready Preview Comment Nov 19, 2025 7:44pm
4 Skipped Deployments
Project Deployment Preview Comments Updated (UTC)
docs-v2 Skipped Skipped Nov 19, 2025 7:44pm
nebula Skipped Skipped Nov 19, 2025 7:44pm
thirdweb_playground Skipped Skipped Nov 19, 2025 7:44pm
wallet-ui Skipped Skipped Nov 19, 2025 7:44pm

@vercel vercel bot temporarily deployed to Preview – wallet-ui November 18, 2025 16:41 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 November 18, 2025 16:41 Inactive
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Nov 18, 2025

Walkthrough

When canClaimFaucetQuery indicates paid-plan-required, FaucetButton now renders an upsell link/button to /billing with an inline arrow icon, short-circuiting the previous disabled-button path and removing the prior inline availability message; other disabled cases (throttle/unsupported-chain) are unchanged.

Changes

Cohort / File(s) Summary
FaucetButton Enhancement
apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx
Added ArrowUpRightIcon import. When canClaim === false and type === "paid-plan-required", render an upsell link/button to /billing with an inline arrow icon (short-circuits previous disabled-button rendering). Removed the inline "availability on Starter/Growth/Scale/Pro" message and a TODO comment. Throttle and unsupported-chain disabled-button branches remain.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant FaucetButton
  participant Billing as "/billing"

  User->>FaucetButton: open/interact
  FaucetButton->>FaucetButton: check canClaimFaucetQuery.data
  alt paid-plan-required
    FaucetButton->>User: render upsell link/button (arrow icon)
    User->>Billing: follow link to /billing
  else throttle or unsupported-chain
    FaucetButton->>User: render disabled button with reason
  end
Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

  • Files to check closely:
    • apps/.../FaucetButton.tsx — verify import, link URL /billing, accessibility (aria) attributes, visual/icon alignment, and that other disabled branches remain intact.

Pre-merge checks and finishing touches

❌ Failed checks (1 warning, 1 inconclusive)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
Description check ❓ Inconclusive The description includes a PR-Codex overview explaining the changes but lacks required template sections: no issue tag, minimal notes for reviewer, and no testing instructions specified. Add the issue tag (TEAM-XXXX format), provide explicit 'Notes for the reviewer' section, and specify testing methodology or that tests exist.
✅ Passed checks (1 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and specifically describes the main change: linking to the billing page in the faucet button for free plan users.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch 11-18-link_to_team_billing_page_in_faucet_button_on_free_plan

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 8f74c85 and 7b5682c.

📒 Files selected for processing (1)
  • apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx (2 hunks)
🧰 Additional context used
🧠 Learnings (3)
📓 Common learnings
Learnt from: jnsdls
Repo: thirdweb-dev/js PR: 7888
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/payments/page.tsx:77-81
Timestamp: 2025-08-20T10:35:18.543Z
Learning: The webhooks/payments route exists at apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/payments/page.tsx and was added as part of the unified project layout PR #7888.
📚 Learning: 2025-07-07T21:21:47.488Z
Learnt from: saminacodes
Repo: thirdweb-dev/js PR: 7543
File: apps/portal/src/app/pay/page.mdx:4-4
Timestamp: 2025-07-07T21:21:47.488Z
Learning: In the thirdweb-dev/js repository, lucide-react icons must be imported with the "Icon" suffix (e.g., ExternalLinkIcon, RocketIcon) as required by the new linting rule, contrary to the typical lucide-react convention of importing without the suffix.

Applied to files:

  • apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx
📚 Learning: 2025-07-31T16:17:42.753Z
Learnt from: MananTank
Repo: thirdweb-dev/js PR: 7768
File: apps/playground-web/src/app/navLinks.ts:1-1
Timestamp: 2025-07-31T16:17:42.753Z
Learning: Configuration files that import and reference React components (like icon components from lucide-react) need the "use client" directive, even if they primarily export static data, because the referenced components need to be executed in a client context when used by other client components.

Applied to files:

  • apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
  • GitHub Check: Size
  • GitHub Check: Lint Packages
  • GitHub Check: Analyze (javascript)
🔇 Additional comments (2)
apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx (2)

6-6: LGTM!

The icon import follows the repository's convention of using the "Icon" suffix for lucide-react imports.


196-209: URL pattern is correct.

The /team/~/~/billing URL is an intentional pattern used consistently across the codebase. The ~ serves as a fallback reference to the current/default team when explicit team context isn't available (as is the case for FaucetButton, which is rendered deep in the dashboard routes without team-specific context). This matches the established convention seen in other context-agnostic components like account-button.client.tsx. The implementation is correct.

Warning

Review ran into problems

🔥 Problems

Errors were encountered while retrieving linked issues.

Errors (1)
  • TEAM-0000: Entity not found: Issue - Could not find referenced Issue.

Comment @coderabbitai help to get the list of available commands and usage tips.

@MananTank MananTank marked this pull request as ready for review November 18, 2025 16:41
@MananTank MananTank requested review from a team as code owners November 18, 2025 16:41
@github-actions github-actions bot added the Dashboard Involves changes to the Dashboard. label Nov 18, 2025
Copy link
Member Author

MananTank commented Nov 18, 2025


How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

  • merge-queue - adds this PR to the back of the merge queue
  • hotfix - for urgent hot fixes, skip the queue and merge this PR next

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has enabled the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

@codecov
Copy link

codecov bot commented Nov 18, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 54.83%. Comparing base (51f46d3) to head (7b5682c).
⚠️ Report is 2 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #8429   +/-   ##
=======================================
  Coverage   54.83%   54.83%           
=======================================
  Files         919      919           
  Lines       60868    60868           
  Branches     4141     4141           
=======================================
  Hits        33375    33375           
  Misses      27391    27391           
  Partials      102      102           
Flag Coverage Δ
packages 54.83% <ø> (ø)
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@github-actions
Copy link
Contributor

github-actions bot commented Nov 18, 2025

size-limit report 📦

Path Size
@thirdweb-dev/nexus (esm) 104.88 KB (0%)
@thirdweb-dev/nexus (cjs) 316.6 KB (0%)

@graphite-app
Copy link
Contributor

graphite-app bot commented Nov 18, 2025

Merge activity

graphite-app bot pushed a commit that referenced this pull request Nov 18, 2025
<!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR adds a new condition to the `FaucetButton` component to handle cases where a paid plan is required to access the faucet. It provides a user-friendly message and a link to upgrade their plan.

### Detailed summary
- Added a check for `canClaimFaucetQuery.data.type` being `"paid-plan-required"`.
- Rendered a button linking to the billing page with a message about upgrading the plan.
- Removed a TODO comment regarding upselling plans.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

* **New Features**
  * Enhanced faucet button experience for premium plan scenarios. The button now provides a direct link to manage billing and subscription options when a plan upgrade is required, replacing the previous notification message with a more actionable interface.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
@graphite-app graphite-app bot force-pushed the 11-18-link_to_team_billing_page_in_faucet_button_on_free_plan branch from 588ea30 to 8f74c85 Compare November 18, 2025 16:51
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground November 18, 2025 16:51 Inactive
@vercel vercel bot temporarily deployed to Preview – nebula November 18, 2025 16:51 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 November 18, 2025 16:51 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui November 18, 2025 16:51 Inactive
<!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR enhances the `FaucetButton` component by introducing a new condition to handle cases where a paid plan is required to access the faucet. It provides a link to upgrade the plan if the user is on a free plan.

### Detailed summary
- Added a check for `canClaimFaucetQuery.data.type` being `"paid-plan-required"`.
- If true, renders a button linking to the billing page with an upgrade message.
- Removed a TODO comment regarding upsell paths for subscription plans.
- Cleaned up the conditional rendering logic for the button.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

* **New Features**
  * Enhanced faucet button for paid-plan scenarios: when claiming is blocked by plan limits, the button now links directly to billing/subscription management and shows an inline arrow indicator for a clearer, actionable path.
* **Bug Fixes**
  * Preserved existing disabled states for throttle and unsupported-chain cases to avoid regressions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
@graphite-app graphite-app bot force-pushed the 11-18-link_to_team_billing_page_in_faucet_button_on_free_plan branch from 8f74c85 to 7b5682c Compare November 19, 2025 19:36
@vercel vercel bot temporarily deployed to Preview – docs-v2 November 19, 2025 19:36 Inactive
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground November 19, 2025 19:36 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui November 19, 2025 19:36 Inactive
@vercel vercel bot temporarily deployed to Preview – nebula November 19, 2025 19:36 Inactive
@graphite-app graphite-app bot merged commit 7b5682c into main Nov 19, 2025
24 checks passed
@graphite-app graphite-app bot deleted the 11-18-link_to_team_billing_page_in_faucet_button_on_free_plan branch November 19, 2025 19:45
@vercel vercel bot temporarily deployed to Production – nebula November 19, 2025 19:45 Inactive
@vercel vercel bot temporarily deployed to Production – docs-v2 November 19, 2025 19:45 Inactive
@vercel vercel bot temporarily deployed to Production – wallet-ui November 19, 2025 19:45 Inactive
@vercel vercel bot temporarily deployed to Production – thirdweb_playground November 19, 2025 19:45 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Dashboard Involves changes to the Dashboard.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants